<!--
 * @Author: aliyun3129073295 1718324422@qq.com
 * @Date: 2022-10-24 14:46:29
 * @LastEditors: aliyun3129073295 1718324422@qq.com
 * @LastEditTime: 2022-10-25 16:57:33
 * @FilePath: \xu_vue\src\components\header.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="main">
      <div class="main_core">
        <img src="../assets/pic/椭圆形备份@2x.png" alt=""/>
        <el-dropdown :hide-on-click="false">
        <span class="el-dropdown-link">
            <span>管理员</span>
            <i class="el-icon-arrow-down el-icon--right"></i>
        </span>
        <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>修改密码</el-dropdown-item>
            <el-dropdown-item ><span @click="goLogin">退出登录</span></el-dropdown-item>
        </el-dropdown-menu>
        </el-dropdown>

      </div>
    </div>
</template>

<script>
    export default {
        name,
        methods:{
           goLogin(){
            this.$router.push('/login')
            console.log(111);
           }
        }
    }
</script>

<style scoped>
.main{
  /* width: 100%; */
  position: fixed;
  right: 0;
}
.main_core{
  height: 60px;
  /* background-color: rgb(90, 54, 54); */
  display: flex;
  align-items: center;
  margin-right: 100px;
  /* justify-self: flex-end; */
}
  .el-dropdown-link {
    cursor: pointer;
    color: #409EFF;
  }
  .el-icon-arrow-down {
    font-size: 12px;
  }
  img{
    width: 40px;
    margin-right: 20px;
  }
  ::v-deep(.el-dropdown-link[data-v-29e8c3c6] ){
    color:black
  }

</style>